<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>监考一览表</title>
	<link rel="stylesheet" href="layui/css/layui.css">
	<link rel="stylesheet" href="css/soulTable.css" media="all"/>
	<script src="layui/layui.js"></script>
</head>
<body>
	<h2 align=center>监考一览表</h2>
	<table id="myTable" lay-filter="invigilator_list"></table>
	<script type="text/html" id="toolbar1">
		<div><button class="layui-btn layui-btn-sm" lay-event="clearFilter">清除所有筛选条件</button></div>
	</script>
	<script type="text/html" id="toolbar2">
		<a class="layui-btn layui-btn-xs" lay-event="view">查看他的监考</a>
	</script>
	<script type="text/javascript" src="layui/layui.js"></script>
	<script>
		layui.config({
		    base: 'ext/',   // 模块目录
		}).extend({                         
		    soulTable: 'soulTable'  // 模块别名
		});
		
		layui.use(['form', 'table','soulTable'], function () {
	   	var table = layui.table,
	  	soulTable = layui.soulTable;
	   	
	   	
	   	// 后台分页
	   	table.render({
			elem: '#myTable'
		    ,id: 'myTable'
		    ,url: 'InvigilationQueryServlet'
		    ,height: 500
		    ,toolbar: '#toolbar1'
		    ,page: true
		    ,cols: [[
			  {type: 'checkbox', fixed: 'left'},
			  {field: 'staffNo', title: '教师编号', width: 100 , filter: true},
		      {field: 'name', title: '教师姓名', width: 110, sort: true, filter: true},
		      {field: 'workload', title: '工作量积分', width: 150, sort: true, filter: true},
		      {field: 'statusString', title: '教师状态', width: 100 , filter: true},
		      {field: 'term', title: '学期', width: 120,  filter: true},
		      {field: 'college', title: '学院', width: 120, filter: true},
		      {title: '操作', width: 220, fixed: 'right', templet: '#toolbar2'}
		    ]]
		    ,done: function () {
		      soulTable.render(this)
		    }
		   	,parseData: function(res){ //res 即为原始返回的数据
	   			var records = res.data;
		   		for(var record of records){
		   			record.statusString = record.status==0?"可监考":"外出";
		   		}
	   			
		   	    var newData={
		   	      "code": res.code, //解析接口状态
		   	      "msg": res.msg, //解析提示文本
		   	      "count": res.count, //解析数据长度
		   	      "data": res.data //解析数据列表
		   	    };
	   		return newData;
	   	  }
		  });
		  
		  table.on('toolbar(invigilator_list)', function(obj){
		    if (obj.event === 'clearFilter') {
		      // 清除所有筛选条件并重载表格
		      // 参数: tableId
		      soulTable.clearFilter('myTable')
		    }
		  });
		  
		  //监听行工具事件
          table.on('tool(invigilator_list)', function(obj){
              var data = obj.data;
              var httpRequest = new XMLHttpRequest();
              if(obj.event === 'view'){//查看监考
                  //httpRequest.open('POST', 'invigilation_detail.jsp', true);
                  //httpRequest.setRequestHeader("Content-type","application/x-www-form-urlencoded");
                  //httpRequest.send('staffNo='+data.staffNo);
                  var para="staffNo=";
                  para+=data.staffNo;
                  window.location.href="invigilation_detail.jsp?"+para;//跳转    
              } 
          });
		})
	</script>
</body>
</html>